<template>
  <div>
    <el-table
        v-show = "visible"
        :data="tableData"
        style="width: 100%">

      <el-table-column
          prop="name"
          label="药名"
          width="180">
      </el-table-column>
      <el-table-column
          prop="bie_min"
          label="别 名">
      </el-table-column>
      <el-table-column
          prop="en_ame"
          label="英文名"
          width="180">
      </el-table-column>

      <el-table-column
          fixed="right"
          label="操作"
          width="100">
        <template slot-scope="scope">
          <el-button @click="handleClick(scope.row)" type="text" size="small">详情</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
const data1 = [{
  name: '二脱氧胞苷',
  bie_min: '扎西胞苷、扎西他滨、Zalcitabine、Hivid、DDC',
  en_name: 'Dideoxycytidine'
}, {
  name: '二乙酰邻苯二酚',
  bie_min: '滴见灭、苯二甲酸甲酯、酞酸甲酯、Dijanmie、Avolin、DMP、Fermine、Mipax、Palationl',
  en_name: 'Diacetylcatechol'
}, {
  name: '二氧化碳',
  bie_min: '无水碳酸、碳酸酐、碳酸气、Carbon dioxide',
  en_name: 'Carbon Dioxyde'
}, {
  name: '二溴甘露醇',
  bie_min: 'Dibromomannitol、DBM、Myelobromol',
  en_name: 'Mitobronitol'
}];

export default {
  name: "ProductList",
  data() {
    return {
      visible:false,
      tableData: data1
    }
  },
  methods:{
    handleClick(){
      alert('详情')
    },
    search(){
      this.visible = true;
    },
    clear(){
      this.visible = false;
    }
  }
}
</script>

<style scoped>

</style>